<template>

  <div class="app-container home">
      <el-image  src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fcdn.bianchengquan.com%2F555d6702c950ecb729a966504af0a635%2Fblog%2F5ff949fcbdcde.gif&refer=http%3A%2F%2Fcdn.bianchengquan.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1653811610&t=3d35b12b1bd7f3c26c51d7c8c1fa9c7b" :preview-src-list="srcList" style="width: 15px; height: 15px; opacity: 0.05;">
        </el-image>
    <vue-particles
      style="margin-top: 5px"
      class="login-bg"
      color="#ffbbff"
      :particleOpacity="0.7"
      :particlesNumber="100"
      shapeType="star"
      :particleSize="5"
      linesColor="#ff83fa"
      :linesWidth="3"
      :lineLinked="true"
      :lineOpacity="0.6"
      :linesDistance="150"
      :moveSpeed="1.8"
      :hoverEffect="true"
      hoverMode="grab"
      :clickEffect="true"
      clickMode="push">
    </vue-particles>
  </div>
</template>

<script>
export default {

   name: 'SidebarLogo',

  data() {
    return {
      srcList: [
        'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fcdn.bianchengquan.com%2F555d6702c950ecb729a966504af0a635%2Fblog%2F5ff949fcbdcde.gif&refer=http%3A%2F%2Fcdn.bianchengquan.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1653811610&t=3d35b12b1bd7f3c26c51d7c8c1fa9c7b',
      ],
    }
  }
}
</script>

<style scoped lang="scss">

  //如果全屏展示
  .login-bg{
    width: 100%;height: 90%;
    background-size: cover;
    background-image: url("https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fi0.hdslb.com%2Fbfs%2Farticle%2Fwatermark%2Fea95dcfe11e83e504662261ee5fd35d23b86d8db.jpg&refer=http%3A%2F%2Fi0.hdslb.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1653706165&t=b69baa0bfd4a66f267adbe128245bb35");
  }

</style>

